import { fetchLoginConfig } from '@/services/ant-design-pro/api';
import { Avatar, Button, Card, Space } from 'antd';
import React, { useEffect, useState } from 'react';
import { history } from 'umi';

import styles from './index.less';

// const LoginMessage: React.FC<{
//   content: string;
// }> = ({ content }) => (
//   <Alert
//     style={{
//       marginBottom: 24,
//     }}
//     message={content}
//     type="error"
//     showIcon
//   />
// );

const getUrlQuery: (key: string) => string | false = (key: string) => {
  const query = window.location.search.substring(1);
  const vars = query.split('&');

  for (let i = 0; i < vars.length; i += 1) {
    const pair = vars[i].split('=');
    if (pair[0] === key) return pair[1];
  }
  return false;
};

const Login: React.FC = () => {
  // const [userLoginState, setUserLoginState] = useState<API.LoginResult>({});
  // const [type, setType] = useState<string>('account');
  // const { initialState, setInitialState } = useModel('@@initialState');

  // // const intl = useIntl();

  // const fetchUserInfo = async () => {
  //   const userInfo = await initialState?.fetchUserInfo?.();
  //   if (userInfo) {
  //     await setInitialState((s) => ({
  //       ...s,
  //       currentUser: userInfo,
  //     }));
  //   }
  // };




  // const handleSubmit = async (values: API.LoginParams) => {
  //   try {
  //     // 登录
  //     const msg = await login({ ...values, type });
  //     if (msg.status === 'ok') {
  //       const defaultLoginSuccessMessage = intl.formatMessage({
  //         id: 'pages.login.success',
  //         defaultMessage: '登录成功！',
  //       });
  //       message.success(defaultLoginSuccessMessage);
  //       await fetchUserInfo();
  //       /** 此方法会跳转到 redirect 参数所在的位置 */
  //       if (!history) return;
  //       const { query } = history.location;
  //       const { redirect } = query as { redirect: string };
  //       history.push(redirect || '/');
  //       return;
  //     }
  //     console.log(msg);
  //     // 如果失败去设置用户错误信息
  //     setUserLoginState(msg);
  //   } catch (error) {
  //     const defaultLoginFailureMessage = intl.formatMessage({
  //       id: 'pages.login.failure',
  //       defaultMessage: '登录失败，请重试！',
  //     });
  //     message.error(defaultLoginFailureMessage);
  //   }
  // };
  // const { status, type: loginType } = userLoginState;

  if (localStorage.getItem('token')) {
    window.location.href = '/';
    history.replace({
      pathname: '/',
    });
    return null;
  }

  const [conf, setConf] = useState({});

  useEffect(() => {
    // fetchJinjiangOAuth().then(
    //   ({data})=>{
    //     if(data.OAuth.ClientID){
    //       window.location.href = `${data.OAuth.RequestAuthUrl}`;
    //     }
    //   }
    // )
    fetchLoginConfig().then(
      ({ data }) => {
        setConf(data);
      }
    );
  }, []);

  return (
    // <div className={styles.container}>
    //   <div className={styles.lang} data-lang>
    //     {SelectLang && <SelectLang />}
    //   </div>
    //   <div className={styles.content}>
    //     <LoginForm
    //       logo={<img alt="logo" src="/logo.svg" />}
    //       title="Ant Design"
    //       subTitle={intl.formatMessage({ id: 'pages.layouts.userLayout.title' })}
    //       initialValues={{
    //         autoLogin: true,
    //       }}
    //       actions={[
    //         <FormattedMessage
    //           key="loginWith"
    //           id="pages.login.loginWith"
    //           defaultMessage="其他登录方式"
    //         />,
    //         <AlipayCircleOutlined key="AlipayCircleOutlined" className={styles.icon} />,
    //         <TaobaoCircleOutlined key="TaobaoCircleOutlined" className={styles.icon} />,
    //         <WeiboCircleOutlined key="WeiboCircleOutlined" className={styles.icon} />,
    //       ]}
    //       onFinish={async (values) => {
    //         await handleSubmit(values as API.LoginParams);
    //       }}
    //     >
    //       <Tabs activeKey={type} onChange={setType}>
    //         <Tabs.TabPane
    //           key="account"
    //           tab={intl.formatMessage({
    //             id: 'pages.login.accountLogin.tab',
    //             defaultMessage: '账户密码登录',
    //           })}
    //         />
    //         <Tabs.TabPane
    //           key="mobile"
    //           tab={intl.formatMessage({
    //             id: 'pages.login.phoneLogin.tab',
    //             defaultMessage: '手机号登录',
    //           })}
    //         />
    //       </Tabs>

    //       {status === 'error' && loginType === 'account' && (
    //         <LoginMessage
    //           content={intl.formatMessage({
    //             id: 'pages.login.accountLogin.errorMessage',
    //             defaultMessage: '账户或密码错误(admin/ant.design)',
    //           })}
    //         />
    //       )}
    //       {type === 'account' && (
    //         <>
    //           <ProFormText
    //             name="username"
    //             fieldProps={{
    //               size: 'large',
    //               prefix: <UserOutlined className={styles.prefixIcon} />,
    //             }}
    //             placeholder={intl.formatMessage({
    //               id: 'pages.login.username.placeholder',
    //               defaultMessage: '用户名: admin or user',
    //             })}
    //             rules={[
    //               {
    //                 required: true,
    //                 message: (
    //                   <FormattedMessage
    //                     id="pages.login.username.required"
    //                     defaultMessage="请输入用户名!"
    //                   />
    //                 ),
    //               },
    //             ]}
    //           />
    //           <ProFormText.Password
    //             name="password"
    //             fieldProps={{
    //               size: 'large',
    //               prefix: <LockOutlined className={styles.prefixIcon} />,
    //             }}
    //             placeholder={intl.formatMessage({
    //               id: 'pages.login.password.placeholder',
    //               defaultMessage: '密码: ant.design',
    //             })}
    //             rules={[
    //               {
    //                 required: true,
    //                 message: (
    //                   <FormattedMessage
    //                     id="pages.login.password.required"
    //                     defaultMessage="请输入密码！"
    //                   />
    //                 ),
    //               },
    //             ]}
    //           />
    //         </>
    //       )}

    //       {status === 'error' && loginType === 'mobile' && <LoginMessage content="验证码错误" />}
    //       {type === 'mobile' && (
    //         <>
    //           <ProFormText
    //             fieldProps={{
    //               size: 'large',
    //               prefix: <MobileOutlined className={styles.prefixIcon} />,
    //             }}
    //             name="mobile"
    //             placeholder={intl.formatMessage({
    //               id: 'pages.login.phoneNumber.placeholder',
    //               defaultMessage: '手机号',
    //             })}
    //             rules={[
    //               {
    //                 required: true,
    //                 message: (
    //                   <FormattedMessage
    //                     id="pages.login.phoneNumber.required"
    //                     defaultMessage="请输入手机号！"
    //                   />
    //                 ),
    //               },
    //               {
    //                 pattern: /^1\d{10}$/,
    //                 message: (
    //                   <FormattedMessage
    //                     id="pages.login.phoneNumber.invalid"
    //                     defaultMessage="手机号格式错误！"
    //                   />
    //                 ),
    //               },
    //             ]}
    //           />
    //           <ProFormCaptcha
    //             fieldProps={{
    //               size: 'large',
    //               prefix: <LockOutlined className={styles.prefixIcon} />,
    //             }}
    //             captchaProps={{
    //               size: 'large',
    //             }}
    //             placeholder={intl.formatMessage({
    //               id: 'pages.login.captcha.placeholder',
    //               defaultMessage: '请输入验证码',
    //             })}
    //             captchaTextRender={(timing, count) => {
    //               if (timing) {
    //                 return `${count} ${intl.formatMessage({
    //                   id: 'pages.getCaptchaSecondText',
    //                   defaultMessage: '获取验证码',
    //                 })}`;
    //               }
    //               return intl.formatMessage({
    //                 id: 'pages.login.phoneLogin.getVerificationCode',
    //                 defaultMessage: '获取验证码',
    //               });
    //             }}
    //             name="captcha"
    //             rules={[
    //               {
    //                 required: true,
    //                 message: (
    //                   <FormattedMessage
    //                     id="pages.login.captcha.required"
    //                     defaultMessage="请输入验证码！"
    //                   />
    //                 ),
    //               },
    //             ]}
    //             onGetCaptcha={async (phone) => {
    //               const result = await getFakeCaptcha({
    //                 phone,
    //               });
    //               if (result === false) {
    //                 return;
    //               }
    //               message.success('获取验证码成功！验证码为：1234');
    //             }}
    //           />
    //         </>
    //       )}
    //       <div
    //         style={{
    //           marginBottom: 24,
    //         }}
    //       >
    //         <ProFormCheckbox noStyle name="autoLogin">
    //           <FormattedMessage id="pages.login.rememberMe" defaultMessage="自动登录" />
    //         </ProFormCheckbox>
    //         <a
    //           style={{
    //             float: 'right',
    //           }}
    //         >
    //           <FormattedMessage id="pages.login.forgotPassword" defaultMessage="忘记密码" />
    //         </a>
    //       </div>
    //     </LoginForm>
    //   </div>
    //   <Footer />
    // </div>
    <div className={styles.login}>
      <Card bodyStyle={{ textAlign: 'center' }} bordered={false}>
        <div style={{ padding: '16px' }}><Avatar src="/casing.png" style={{ width: '200px', height: '200px' }} /></div>
        <Button type="primary" onClick={(e) => {
          const redirect = getUrlQuery('redirect');
          const goto = redirect ? ('?redirect=' + decodeURIComponent(redirect)) : '';
          window.location.href = `${conf}?service=${window.location.origin}/user/cas${goto}`
        }}>
          <Space>登录Authsaur控制台</Space>
        </Button>
      </Card>
    </div>
  );
};

export default Login;
